import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:ytbusiness/config/style.dart';
import 'package:ytbusiness/config/yt_theme.dart';
import 'package:ytbusiness/utils/helper.dart';
import 'package:ytbusiness/utils/screen_adaptation.dart';

//配件中心
class AccessoriesCenter extends StatefulWidget {
  @override
  _AccessoriesCenterState createState() => _AccessoriesCenterState();
}

class _AccessoriesCenterState extends State<AccessoriesCenter> {
  List<String> accessoriesList = [
    "发动机",
    "变速箱",
    "电器、排气、照明",
    "转向、制动、悬挂",
    "车内装饰",
    "车身部分"
  ]; //配件列表
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () {
        FocusScope.of(context).requestFocus(FocusNode());
      },
      child: Scaffold(
        backgroundColor: Colors.white,
        body: SafeArea(
          child: Container(
            color: YTStyle.bgColor,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                //搜索框
                Container(
                  padding: EdgeInsets.all(15),
                  color: Colors.white,
                  child: Row(
                    children: [
                      GestureDetector(
                        behavior: HitTestBehavior.opaque,
                        onTap: () {
                          Navigator.pop(context);
                        },
                        child: Container(
                          padding: EdgeInsets.all(setWidth(3)),
                            width: setWidth(16),
                            height: setWidth(23),
                            child: Image.asset(
                              "assets/images/return.png",
                              fit: BoxFit.cover,
                            )),
                      ),
                      SizedBox(
                        width: setWidth(10),
                      ),
                      Expanded(
                        child: Container(
                          height: setWidth(33),
                          decoration: BoxDecoration(
                              color: Color(0xffF9F9F9),
                              borderRadius: BorderRadius.circular(2)),
                          child: TextField(
                            maxLines: 1,
                            keyboardType: TextInputType.multiline,
                            autofocus: false,
                            style: TextStyle(
                                color: Color(0xff030303), fontSize: setSp(16)),
                            cursorColor: YTTheme.theme,
                            textAlign: TextAlign.start,
                            enableInteractiveSelection: false,
                            inputFormatters: [
                              WhitelistingTextInputFormatter(
                                  RegExp("[a-zA-Z]|[0-9.-_]|[\u4e00-\u9fa5]")),
                            ],
                            decoration: InputDecoration(
                                contentPadding:
                                    EdgeInsets.only(left: setWidth(19)),
                                border: InputBorder.none,
                                focusedBorder: InputBorder.none,
                                enabledBorder: InputBorder.none,
                                suffixIcon: Container(
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      GestureDetector(
                                        behavior: HitTestBehavior.opaque,
                                        onTap: () {},
                                        child: Container(
                                            width: setWidth(30),
                                            alignment: Alignment.center,
                                            child: Column(
                                              children: [
                                                Container(
                                                  width: setWidth(18),
                                                  height: setWidth(19),
                                                  child: Image.asset(
                                                    "assets/images/search.png",
                                                    fit: BoxFit.cover,
                                                    color: YTTheme.theme,
                                                  ),
                                                ),
                                              ],
                                            )),
                                      )
                                    ],
                                  ),
                                ),
                                hintText: '输入关键词或OE信息',
                                hintStyle: TextStyle(
                                    color: Color(0xff989898),
                                    fontSize: setSp(15))),
                          ),
                        ),
                      )
                    ],
                  ),
                ),
                //配件中心
                Expanded(
                  child: CustomScrollView(
                    slivers: [
                      SliverToBoxAdapter(
                        child: Container(
                          padding: EdgeInsets.only(
                              top: setWidth(17),
                              bottom: setWidth(17),
                              left: setWidth(16)),
                          color: Color(0xffF0F0F0),
                          child: Text(
                            "配件中心",
                            style: TextStyle(
                                color: Color(0xff323232),
                                fontSize: setSp(17),
                                fontWeight: FontWeight.w500),
                          ),
                        ),
                      ),
                      SliverList(
                          delegate:
                              SliverChildBuilderDelegate((context, index) {
                        return _accessoriesItem(accessoriesList[index]);
                      }, childCount: accessoriesList.length)),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  //配件类型列表
  Widget _accessoriesItem(String item) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: (){
        urlPush(context, "yuntu://select_accessories?title=$item");
      },
      child: Container(
        padding: EdgeInsets.only(left: setWidth(15), right: setWidth(15)),
        color: Colors.white,
        child: Column(
          children: [
            SizedBox(
              height: setWidth(22),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Expanded(
                  child: Container(
                      child: RichText(
                          text: TextSpan(children: [
                    TextSpan(
                        text: "$item",
                        style: TextStyle(
                          color: Color(0xff323232),
                          fontSize: setSp(15),
                        )),
                    WidgetSpan(
                        child: Container(
                            margin: EdgeInsets.only(left: setWidth(10)),
                            padding: EdgeInsets.only(
                                left: setWidth(8),
                                right: setWidth(8),
                                top: setWidth(1),
                                bottom: setWidth(1)),
                            decoration: BoxDecoration(
                                borderRadius: BorderRadius.circular(8),
                                border: Border.all(
                                    color: Color(0xffFF6701),
                                    width: setWidth(0.5))),
                            child: Text("3",
                                style: TextStyle(
                                  color: Color(0xffFF6701),
                                  fontSize: setSp(12),
                                ))))
                  ]))),
                ),
                SizedBox(
                  width: setWidth(15),
                ),
                Container(
                  width: setWidth(9),
                  height: setWidth(14),
                  child: Image.asset("assets/images/right_go.png",
                      fit: BoxFit.cover),
                ),
              ],
            ),
            SizedBox(
              height: setWidth(22),
            ),
            Container(
              color: Color(0xffF0F0F0),
              height: setWidth(0.5),
            ),
          ],
        ),
      ),
    );
  }
}
